<style scoped>
 .ivu-table td.demo-table-info-column{
        background-color: #2db7f5;
        color: #fff;
    }
</style>
<template>
  <div>

    <Table
      ref="table"
      style="margin-bottom: 10px"
      border
      :loading="loadingTable"
      :columns="tableTitle"
      :data="tableData"
      :height="tableHeight"
    ></Table>
    <Page
      :total="total"
      :current="page"
      :page-size="size"
      :page-size-opts="[10, 50, 100, 300, 500, 1000, 2000, 5000]"
      @on-change="
        (s) => {
          page = s;
          SearchProductLog();
        }
      "
      @on-page-size-change="
        (p) => {
          size = p;
          page = 1;
          SearchProductLog();
        }
      "
      show-total
      show-sizer
    />

  </div>
</template>

<script>
import { SearchProductLog } from '@/api/product'
export default {
  name: 'productlog',
  props: {
    Id: {
      type: String | Number,
      default: ''
    }
  },
  data () {
    return {
      total: 0,
      page: 1,
      size: 50,
      tableHeight: 500,
      status: -1,
      keyword: '',
      loadingTable: false,
      tableTitle: [
        {
          type: 'index',
          title: '序号',
          align: 'center',
          width: 60,
          render: (h, params) => {
            return h('span', params.index + (this.page - 1) * this.size + 1)
          }
        },
        {
          key: 'CreatedTime',
          title: '操作时间',
          width: 160,
          align: 'center'
        },
        {
          key: 'ProductName',
          title: '商品名称',
          width: 120,
          align: 'center'
        },
        {
          key: 'OldNum',
          title: '原数量',
          width: 100,
          align: 'center'
        },
        {
          key: 'ChangeNum',
          title: '变更数量',
          width: 100,
          align: 'center'
        },
        {
          key: 'NewNum',
          title: '变更后数量',
          width: 100,
          align: 'center'
        },

        {
          key: 'TagName',
          title: '变更说明',
          minWidth: 120,
          align: 'center'
        }

      ],
      tableData: []
    }
  },
  computed: {},

  methods: {

    SearchProductLog () {
      let vm = this
      vm.loadingTable = true
      var reqData = {
        page: vm.page,
        size: vm.size,
        ProductId: vm.Id
      }
      SearchProductLog(reqData).then((res) => {
        vm.loadingTable = false
        var data = res.data
        if (data.StatusCode == 200) {
          vm.tableData = data.Data.Items
          vm.total = data.Data.TotalCount
        } else {
          vm.$Notice.error({
            title: data.Errors
          })
        }
      })
    }
  },
  mounted () {
    this.SearchProductLog()
  }
}
</script>

<style>
</style>
